<template lang="pug">
  div
    el-upload.upload-demo(
      action='http://192.168.110.149:8888/api/v1/evidences/upload'
      :before-upload="beforeVideoUpload"
      :on-change='handleChange'
      :on-success="handleSuccess"
      :on-error="handleError"
      :file-list='fileList'
      multiple=false
      )
      el-button(size='small' type='primary') 点击上传
      .el-upload__tip(slot='tip') 支持mp4、flv、mov、avi等多种格式，不超过4GB
</template>

<script>
export default {
  name: 'SingleVideoUpload',
  props: {
    value: {
      type: String,
      default: ''
    }
  },
  data() {
    return {
      tempUrl: '',
      dataObj: { token: '', key: '' },
      videoFile: {
        name: '',
        savePath: ''
      },
      fileList: []
    }
  },
  computed: {
    imageUrl() {
      return this.value
    }
  },
  methods: {
    rmImage() {
      this.emitInput('')
    },
    emitInput(val) {
      this.$emit('input', val)
    },
    handleSuccess(response) {
      console.log(response)
      if (response.code === 20000) {
        this.videoFile.name = response.data.fileName
        this.videoFile.savePath = response.data.path
        this.$emit('on-upload-file', this.videoFile)
      }
    },
    handleError(err, file) {
      console.log(err)
      console.log(file)
    },
    handleChange(file, fileList) {
      this.fileList = fileList.slice(-1)
      // console.log(this.fileList)
    },
    beforeVideoUpload(file) {
      // const isJPG = file.type === 'image/jpeg';
      const isLt4GB = file.size / 1024 / 1024 / 1024 < 4

      // if (!isJPG) {
      //   this.$message.error('上传头像图片只能是 JPG 格式!');
      // }
      if (!isLt4GB) {
        this.$message.error('上传视频文件大小不能超过 4GB!')
      }
      // return isJPG && isLt2M;
      return isLt4GB
    }
  }
}
</script>

<style lang="scss" scoped>
@import "~@/styles/mixin.scss";

.upload-container {
  width: 100%;
  position: relative;
  @include clearfix;
  .image-uploader {
    width: 35%;
    float: left;
  }
}
</style>
